<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>json数组</title>
</head>
<body>
    <!-- 合法的json数据类型：字符串，数字，对象，数组，布尔值，null -->
    <script>
        // 定义一个json对象
        var json={
            'name':'网站',
            'num': 3,
            // 内嵌套一个json数组对象
            'sites':['google','baidu','taobao'],
        };
        // 使用索引值访问数组
        var x=json.sites[0];
        console.log(x);

        // 【json数组内的数据是字符串，所以去获取数据的y也要是字符串数据类型，注意定义y的时候加引号】
        var i,y='';
        // 使用for-in循环或for循环来访问数组内数据
        for(i in json.sites){
            y+=json.sites[i];
        }
        console.log(y);
    </script>









    <div id="box">

    </div>

    <script>
        // 嵌套json对象中的数组
        var myobj = {
            'name':"网站",
            'num': 3,
            'sites':[
                {'name':"google",'info':['android','google搜索','google翻译']},
                {'name':"runoob",'info':['菜鸟教程','菜鸟工具','菜鸟微信']},
                {'name':"taobao",'info':['淘宝','网购']},
            ]
        };
        var j,q,y='';
        var s = document.getElementById('box');
        for(j in myobj.sites){
            // 获取到json数组里面单个json对象的name属性值并用h1标签包裹
            y += '<h1>'+myobj.sites[j].name + '</h1>';
            // 循环info数组
            for(q in myobj.sites[j].info) {
                y += myobj.sites[j].info[q] + "<br>";
            }
        }
        console.log(y);
        s.innerHTML=y;
    </script>

</body>
</html>